
<div v-show="showJobInfoAdd" id="showJobInfoAdd" class="panel panel-default" style="width: 100%;float: left;position: absolute">
        <div class="panel-heading">{{title}}</div>
        <form id="jobInfoForm" class="form-horizontal">
            <div class="form-group">
                <p style="border-bottom:1px solid #e5e5e5">基础配置</p>
                <div class="col-sm-1 control-label">任务名称</div>
                <div class="col-sm-4">
                    <input maxlength="20" type="text" class="form-control" v-model="jobinfo.name" placeholder="请给这个任务命名"/>
                </div>

                <div class="col-sm-1 control-label" style="color: blue">运行状态</div>
                <div v-show="triggerStatusEnable" class="col-sm-4">
                    <label class="radio-inline" style="color: green">
                        <input type="radio" name="triggerStatus" value="1" v-model="jobinfo.triggerStatus"/> 启动
                    </label>
                    <label class="radio-inline" style="color: red">
                        <input type="radio" name="triggerStatus" value="0" v-model="jobinfo.triggerStatus"/> 停止
                    </label>
                </div>
                <div v-show="!triggerStatusEnable" class="col-sm-4">
                    <label v-show="jobinfo.triggerStatus == 1" class="radio-inline" style="color: green">
                        启动
                    </label>
                    <label v-show="jobinfo.triggerStatus == 0" class="radio-inline" style="color: red">
                        停止
                    </label>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-1 control-label">执行器</div>
                <div class="col-sm-4">
                    <select id="jobGroup" class="form-control">
                        <option th:each="group:${JobGroupList}" th:value="${group.id}" th:text="${group.title}"></option>
                    </select>
                </div>

                <div class="col-sm-1 control-label">任务描述</div>
                <div class="col-sm-4">
                    <input maxlength="20" type="text" class="form-control" v-model="jobinfo.jobDesc" placeholder="请输入任务描述"/>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-1 control-label">负责人</div>
                <div class="col-sm-4">
                    <input maxlength="30" type="text" class="form-control" v-model="jobinfo.author" placeholder="请输入负责人"/>
                </div>

                <div class="col-sm-1 control-label">报警邮件</div>
                <div class="col-sm-4">
                    <input maxlength="20" type="text" class="form-control" v-model="jobinfo.alarmEmail" placeholder="输入报警邮件，多个逗号分割"/>
                </div>
            </div>

            <div class="form-group">
                <p style="border-bottom:1px solid #e5e5e5">调度配置</p>
                <div class="col-sm-1 control-label">调度类型</div>
                <div class="col-sm-4">
                    <select id="scheduleType" class="form-control" disabled>
                        <option th:each="item:${ScheduleTypeEnum}" th:value="${item}" th:text="${item.title}"></option>
                    </select>
                </div>

                <div class="col-sm-1 control-label">Cron</div>
                <div class="col-sm-4">
                    <input maxlength="128" type="text" class="form-control" v-model="jobinfo.scheduleConf" placeholder="请输入Cron"/>
                </div>
            </div>

            <p style="border-bottom:1px solid #e5e5e5">任务配置 <a style="cursor:pointer" onclick="vm.showSenior(this, 'jobConfig')">展开</a></p>
            <div id="jobConfig" style="display: none;cursor:pointer">
                <div class="form-group">

                    <div class="col-sm-1 control-label">运行模式</div>
                    <div class="col-sm-4">
                        <select id="glueType" class="form-control" disabled>
                            <option th:each="item:${GlueTypeEnum}" th:value="${item}" th:text="${item.desc}"></option>
                        </select>
                    </div>
                    <div class="col-sm-1 control-label">JobHandler</div>
                    <div class="col-sm-4">
                        <input maxlength="100" readonly type="text" class="form-control" v-model="jobinfo.executorHandler" placeholder="请输入JobHandler"/>
                    </div>
                </div>

                <div class="form-group">
                    <div class="col-sm-1 control-label">DataX任务参数</div>
                    <div class="col-sm-4">
                        <textarea maxlength="5000" type="text" class="form-control" v-model="jobinfo.executorParam" placeholder="请输入任务参数"></textarea>
                    </div>
                </div>
            </div>

            <p style="border-bottom:1px solid #e5e5e5">高级配置 <a style="cursor:pointer" onclick="vm.showSenior(this, 'seniorConfig')">展开</a></p>
            <div id="seniorConfig" style="display: none;">
                <div class="form-group">
                    <div class="col-sm-1 control-label">路由策略</div>
                    <div class="col-sm-4">
                        <select id="executorRouteStrategy" class="form-control">
                            <option th:each="item:${ExecutorRouteStrategyEnum}" th:value="${item}" th:text="${item.title}"></option>
                        </select>
                    </div>
                    <div class="col-sm-1 control-label">子任务ID</div>
                    <div class="col-sm-4">
                        <input maxlength="20" type="text" class="form-control" v-model="jobinfo.childJobId" placeholder="请输入子任务的任务ID,如存在多个则逗号分隔"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-1 control-label">调度过期策略</div>
                    <div class="col-sm-4">
                        <select id="misfireStrategy" class="form-control">
                            <option th:each="item:${MisfireStrategyEnum}" th:value="${item}" th:text="${item.title}"></option>
                        </select>
                    </div>
                    <div class="col-sm-1 control-label">阻塞处理策略</div>
                    <div class="col-sm-4">
                        <select id="executorBlockStrategy" class="form-control">
                            <option th:each="item:${ExecutorBlockStrategyEnum}" th:value="${item}" th:text="${item.title}"></option>
                        </select>
                    </div>
                </div>

                <div class="form-group">
                    <div class="col-sm-1 control-label">任务超时时间</div>
                    <div class="col-sm-4">
                        <input maxlength="6" type="text" class="form-control" v-model="jobinfo.executorTimeout" placeholder="任务超时时间单位秒，大于零时生效"/>
                    </div>

                    <div class="col-sm-1 control-label">失败重试次数</div>
                    <div class="col-sm-4">
                        <input maxlength="4" type="text" class="form-control" v-model="jobinfo.executorFailRetryCount" placeholder="失败重试次数，大于零时生效"/>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label"></div>

                <input type="button" class="btn btn-primary" @click="saveOrUpdateJobInfo" value="确定"/>
                &nbsp;&nbsp;<input type="button" class="btn btn-warning" @click="jobInfoAddBack" value="返回"/>
            </div>
        </form>
    </div>
